<div class="container">
   <div class="no_search" *ngIf="!joinRoll.isSearch">
     <img src="/assets/img/image/no_search.png" alt="" width="80" height="99">
     <p style="font-size: 14px;color: #999999;margin-top: 20px">请首先在上方“搜索班级”，再选择班级加入~</p>
     <p style="font-size: 14px;color: #999999;margin-top: 20px" *ngIf="joinRoll.isHaveRoll">还没有符合条件班级</p>
   </div>
  <div class="search" *ngIf="joinRoll.isSearch">
    <div class="roll" *ngFor="let roll of joinRoll.searchRolls;let i = index;">
        <div class="top">
          <div class="cover f_l" [style.background-image]="'url('+readImgUrl+roll.CoverUrl+')'"></div>
          <div class="roll_info f_r">
            <div class="roll_name big_title">{{roll.ClassName}}</div>
            <div class="roll_creator mid_title">{{roll.UserName}}</div>
            <p class="create_time little_title">创建：{{roll.CreateTime.slice(0,10)}}</p>
            <p class="end_time little_title">过期：{{roll.EndTime}}</p>
            <div class="people_num">
              <img src="/assets/img/image/renshu.png" alt="" class="people_logo" width="32" height="20" >
              <span class="mid_title"> {{roll.Number}}人</span>
            </div>
          </div>
        </div>
        <div class="bottom" *ngIf="!roll.joined">
          <input type="text" placeholder="请输入班级邀请码" maxlength="5" [(ngModel)]="joinRoll.InvitationCode[i]">
          <button (click)="joinClass(joinRoll.InvitationCode[i],roll.PK_ClassGuid)">确认</button>
        </div>
    </div>
  </div>
  </div>

